Anseo Admin

Anseo Admin

---

View Demo · Documentation

---

📔 Table of Contents

• Features
• Getting Started
• Screenshots
  • Authentication
  • Configure Travel Card Type
  • Add Account
  • Modify Account
  • Delete Account
• Directory Structure
• System Design
  • Methodology
  • Three Tier Architecture
  • Database
  • USE Case
  • Colour Scheme
• Plugins
• Development Process

---

🎯 Features

• Configure an NFC travel card to contain a fare type
• Create a User / Driver / Admin account
• Modify email, password and personal information of a User / Driver / Admin account
• Delete a User / Driver / Admin account

---

🧰 Getting Started

Have a look at the documentation here to get started.

---

📱 Screenshots

1️⃣ Authentication

Splash Screen	Landing Page	Sign In	Sign Up

2️⃣ Configure Travel Card Type

Configure Travel Card 1	Configure Travel Card 2	Configure Travel Card 3	Configure Travel Card 4

3️⃣ Add Account

Admin Panel	Add Account Type	Add User Account 1

Add User Account 2	Add Admin Account	Add Driver Account 1	Add Driver Account 2

4️⃣ Modify Account

Modify Account Type 1	Select Account to Modify	Modify Account Options	Modify Email 1

Modify Email 2	Modify Password	Modify User Account 1	Modify User Account 2

Modify Driver Account 1	Modify Admin Account 2

5️⃣ Delete Account

Delete Account Type 1	Delete Account Type 2	Delete Account Type 3	Delete Account Type 4

---

📁 Directory Structure

Anseo Admin

|-- lib
|   |-- config
|   |   '-- extensions.dart
|   |-- models
|   |   |-- account.dart
|   |   |-- admin.dart
|   |   |-- driver.dart
|   |   |-- record.dart
|   |   '-- user.dart
|   |-- pages
|   |   |-- account
|   |   |   |-- landing_page.dart
|   |   |   |-- sign_in.dart
|   |   |   '-- sign_up.dart
|   |   |-- home
|   |   |   '-- home.dart
|   |   |-- options
|   |   |   |-- add_account
|   |   |   |   |-- add_account_details.dart
|   |   |   |   '-- add_account.dart
|   |   |   |-- configure_travel_card
|   |   |   |   |-- configure_travel_cards.dart
|   |   |   |   '-- nfc_scan.dart
|   |   |   |-- delete_account
|   |   |   |   '-- delete_account.dart
|   |   |   |-- modify_account
|   |   |   |   |-- modify_account.dart
|   |   |   |   |-- modify_admin_account_details.dart
|   |   |   |   |-- modify_driver_account_details.dart
|   |   |   |   |-- modify_email.dart
|   |   |   |   |-- modify_password.dart
|   |   |   |   |-- modify_user_account_details.dart
|   |   |   |   '-- select_information_to_modify.dart
|   |   |   '-- view_account_list.dart
|   |-- services
|   |   |-- aes_encryption.dart
|   |   |-- firebase_auth.dart
|   |   '-- firebase_database.dart
|   |-- firebase_wrapper.dart
|   '-- main.dart
|-- assets
|   |-- icons
|   |   |-- account.png
|   |   |-- add.png
|   |   |-- delete.png
|   |   |-- edit.png
|   |   |-- email.png
|   |   |-- information.png
|   |   |-- password.png
|   |   '-- travel_card.png
|   |-- logo
|   |   '-- logo1_invert.png
|-- functions
|   '-- index.js
|-- pubspec.yaml

---

📐 System Design

🚥 Methodology

Feature Driven Development (FDD), a part of the Agile Methodology, organizes software development around making progress on features in a systematically manner. This was the chosen methodology used in this application as FDD supports the dynamic evolvement of a feature including the inclusion and/or removal of designs and code, and the overall direction of the project.

Given how this project has multiple features to develop, it will allow for each feature to be developed thoroughly with a specific timeframe using sub-features.

To compensate for the potential decrease in documentation, a daily log with all the progress made regarding each feature will be written out whenever a development is being carried out.

Using GitHub as the choice for version control will also provide documentation on any changes that has occurred.

---

🏢 Three Tier Architecture

Anseo Admin is build upon a three-tier architecture model, as show above. With three-tier architecture, it's advantageous in that any changes made to one tier shouldn’t affect any other tiers in theory. The diagram shows the entities within each layer

---

💿 Database

The admin would need to be able to store their personal information on their account. As the application is developed, each account (user/driver/admin) will be assigned a list of privileges that will allow them to access certain features. The database has been implemented using Firebase Cloud Firestore, a NoSQL database. The following Entity Relationship Diagram highlight the fields necessary to create the database.

---

🎭 USE Case

Use Case Diagrams were created to represent the how the system would behave in line with the users interaction. It demonstrates the compulsory and extendable functionality that is applicable to the user when interacting with the system. In this case there is three actors – the commuter, the bus driver/operator and the admin. Each actor has access to certain functionalities and may share common functionalities with other actors.

---

🎨 Colour Scheme

Main Application

Color	Hex
Primary Color	#673AB7
Secondary Color	#9575CD
Background Color	#FFFFFF
Accent Color	#9FA8DA
Icon Gradient	#1A6DFF #C822FF
Text Color	#000000

---

Travel Cards

Color	Hex	Result
Student Travel Card	#4158D0 #C850C0 #FFCC70
Adult Travel Card	#0061FF #60EFFF
Child Travel Card	#8EC5FC #E0C3FC

---

Logo

Colour	Result
Color Hex Logo Background #FFFFFF Logo Text #4158D0 #C850C0

---

🔌 Plugins

Name	Version	Usage
encrypt	^5.0.1	Generate cryptographically secure random keys and IVs
firebase_auth	^3.3.13	Enabling Android and iOS authentication using passwords, phone numbers and identity providers like Google, Facebook and Twitter
cloud_firestore	^3.1.11	Use the Cloud Firestore API a cloud-hosted, noSQL database with live synchronization
nfc_manager	^3.1.1	Accessing the NFC features on Android and iOS
provider	^6.0.2	Dependency injection and state management
sweetsheet	^0.4.0	Show beautiful bottom sheet as confirmation dialog
google_fonts	^2.3.1	Use fonts from fonts.google.com
flutter_native_splash	^2.1.2+1	Customize Flutter's default white native splash screen with background color and splash image
flutter_launcher_icons	^0.9.2	Updating application launcher icon

---

🚧 Development Process

The documentation process for Anseo Admin can be viewed here